<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<title>角色管理</title>
<body>

	<div id="toolbar">
		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="crud.add('创建新角色')">创建新角色</a>
	</div>
	<table id="dg"></table>

	<div id="dlg" class="easyui-dialog" style="width: 700px; height: 450px; padding: 10px" data-options="closed:true,modal:true,maximized:false" buttons="#dlg-buttons">
		<form id="fm" method="post">
			<div>
				<div class="div-item">
					<span style="color: red;">*</span>角色名:&nbsp;&nbsp;<input class="easyui-validatebox"  type="text" name="roleName" data-options="required:true" />
				</div>
				<div class="div-item">
					<fieldset>
						<legend>设置权限</legend>
						<div id="sysResTree"></div>
					</fieldset>
				</div>
			</div>
		</form>
	</div>

	<div id="dlg-buttons">
		<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="crud.save(); return false;">保存</a> <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="crud.closeDlg(); return false;">取消</a>
	</div>

	<div id="dlgDel" class="easyui-dialog" style="width: 360px; height: 280px; padding: 10px 20px" closed="true" modal="true" title="删除角色" buttons="#dlgdlgDel-buttons">
		<span style="color: red;">删除后,以下成员将失去该角色及对应的功能.确定删除吗?</span>
		<div id="delUsernameGrid"></div>
	</div>

	<div id="dlgdlgDel-buttons">
		<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="doDel(); return false;">确定</a> <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="$('#dlgDel').dialog('close'); return false;">取消</a>
	</div>

	<script type="text/javascript">
		var that = this;
		var $dlgDel = $('#dlgDel');
		var delRow;

		var $sysResTree = $("#sysResTree");
		$sysResTree.tree({
			url : ctx + 'listAllMenu.do',
			formatter : function(node) {
				var text = node.text;
				if (node.sysFuns && node.sysFuns.length > 0) {
					text += buildOperateCheckbox(node.sysFuns)
				}
				return text;
			},
			loadFilter : function(menus, parent) {
				for (var i = 0, len = menus.length; i < len; i++) {
					formatMenu(menus[i]);
				}
				return menus;
			}
		});

		function buildOperateCheckbox(sysFuns) {
			var html = [];
			var sysFun = null;
			for (var i = 0, len = sysFuns.length; i < len; i++) {
				sysFun = sysFuns[i];
				html.push('<label style="vertical-align:top;">')
				html.push('<input name="sfId" type="checkbox" style="vertical-align:top;" value="'+sysFun.sfId+'"/>' + sysFun.funcName);
				html.push('</label>');
			}

			return html.join('');
		}

		function formatMenu(data) {
			if (data) {
				data.attributes = {
					url : data.url,
					srId : data.srId
				}
			}
			var children = data.children;
			if (children && children.length > 0) {
				data.isParent = true;
				for (var i = 0, len = children.length; i < len; i++) {
					formatMenu(children[i]);
				}
			}
		}

		var crud = Crud.create({
			pk : 'roleId',
			listUrl : ctx + 'listRRole.do',
			addUrl : ctx + 'addRRole.do',
			updateUrl : ctx + 'updateRRole.do',
			delUrl : ctx + 'delRRole.do',
			dlgId : 'dlg',
			formId : 'fm',
			gridId : 'dg'
		});

		var buttons = [ {
			text : '修改',
			onclick : function(row) {
				update(row);
			}
		}, {
			text : '删除',
			onclick : function(row) {
				del(row);
			}
		} ];

		crud.buildGrid([ {
			field : 'roleName',
			title : '角色名'
		}, crud.createOperColumn(buttons) ], {
			rownumbers : true
		});

		$('#delUsernameGrid').datagrid({
			columns : [ [ {
				field : 'username',
				title : '用户名',
				width : 100
			} ] ],
			height : 150,
			fitColumns : true,
			striped : true
		})

		function update(row) {
			Action.post(ctx + 'listRolePermissionByRoleId.do', row, function(sysFuns) {
				var sfIds = [];
				for (var i = 0, len = sysFuns.length; i < len; i++) {
					sfIds.push(sysFuns[i].sfId);
				}
				crud.update(row, '修改角色');
				$sysResTree.find(':checkbox').val(sfIds);
			});
		}

		function del(row) {
			if (row) {
				delRow = row;
				var userRoles = listRoleUser(row);

				if (userRoles.length > 0) {
					var title = '删除[<span style="color:red;">' + row.roleName + '</span>]角色';
					console.log(userRoles)
					$('#delUsernameGrid').datagrid('loadData', userRoles);
					$dlgDel.dialog('setTitle', title).dialog('open');
				} else {
					MsgUtil.confirm('确定删除该角色吗?', function() {
						doDel(row);
					});
				}
			}
		}

		function doDel() {
			if (delRow) {
				Action.post(crud.delUrl, delRow, function(result) {
					Action.execResult(result, function() {
						$dlgDel.dialog('close');
						crud.runGridMethod('reload'); // reload the user data
					});
				});
			}
		}

		function listRoleUser(row) {
			var ret = [];
			Action.postSync(ctx + 'listRoleRelationInfo.do', {
				roleId : row.roleId
			}, function(result) {
				if (result.success) {
					ret = result.userRoles;
				}
			});

			return ret;
		}
	</script>
</body>